<!-- 换装 -->
<template>
	<!-- <view class="p40 h100 bsb df fdc">
		<bannerVue></bannerVue>
		<view class="df aic jcsa mt40">
			<text style="font-size:28rpx;color:#7D7D7D;">换装</text>
			<text style="font-size:28rpx;color:#7D7D7D;">已完成台区</text>
		</view>
		<view class="f1">
			<swiper class="h100" :autoplay="false" :duration="500">
				<swiper-item>
					<view class="swiper-item">1</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item">2</view>
				</swiper-item>
			</swiper>
		</view>
	</view> -->
	<view class="header-container">
		<view class="df aic jcsb header-item">
			<text>当前任务完成度：{{}}</text>
			<view class="df fdc aic">
				<img style="width: 36rpx;height: 36rpx;" src="../../static/imgs/refresh.png" alt="" />
				<text class="fs20" style="color: #2D6CE8;">刷新</text>
			</view>
		</view>
		<view class="pr df aic header-item">
			<img style="width: 50rpx;height: 50rpx;position: absolute;left: 20rpx;top: 30rpx;"
				src="../../static/imgs/search.png" alt="" />
			<input class="pl40 bsb" placeholder="台区名称" type="text" />
		</view>
		<view>
			<u-dropdown>
				<u-dropdown-item disabled title="台区"></u-dropdown-item>
				<u-dropdown-item v-model="value2" title="任务状态" :options="options2"></u-dropdown-item>
			</u-dropdown>
		</view>
	</view>
	<view class="mt20">
		<view @click="to_reloader_detail" class="proj-item df aic jcsb">
			<view class="df fdc">
				<text>菜市场台区</text>
				<text>最后修改时间：--</text>
			</view>
			<view class="df fdc">
				<text>完成进度</text>
				<text class="tar">0/162</text>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	
	const uDropDown = ref()
	const options2 = ref([{
			label: '全部',
			value: 1,
		},
		{
			label: '已换装',
			value: 2,
		},
		{
			label: '待换装',
			value: 3,
		}
	])
	const value2 = ref(1)
	
	const to_reloader_detail = ()=>{
		uni.redirectTo({
			url:'/pages/reloaderDetail/reloaderDetail'
		})
	}
</script>

<style lang="scss" scoped>
	page {
		height: 100%;
		box-sizing: border-box;
	}

	.header-item {
		height: 100rpx;
		border-bottom: 2rpx solid #F1F0F0;
		padding: 0 40rpx;
	}

	.header-container {
		box-shadow: 10rpx 10rpx 30rpx 10rpx rgba(0, 0, 0, .1);
	}

	:deep(.u-dropdown__menu__item:first-child) {
		.u-dropdown__menu__item__arrow {
			display: none !important;
		}
	}

	:deep(.u-dropdown__menu__item__text) {
		color: #606266 !important;
	}
	.proj-item{
		padding: 0 10rpx;
		height: 160rpx;
		border-bottom: 2rpx solid #f1f0f0;
	}
</style>